<template>
<div id="fix">
    <h1>404</h1>
    <p>页面丢失或者不存在</p>
    <div id="buut">
        <flexbox >
        <flexbox-item>
            <x-button  type="primary" style="border-radius:8px;" @touchend.native="home">首页</x-button>
        </flexbox-item>
        <flexbox-item>
            <x-button  type="primary"  style="border-radius:8px;" @click.native="back">上一页</x-button>
        </flexbox-item>
        </flexbox>
    </div>
</div>
</template>


<script>
import {  XButton ,Flexbox, FlexboxItem,} from 'vux'
export default {
    components:{
        XButton,Flexbox, FlexboxItem,
    },
    methods:{
        // 回首页
        home(){
            this.$router.push('/')
        },
        // 上一页
        back(){
            this.$router.go(-1);
        }
    }
}
</script>


<style scoped>
#fix{
    height: 100vh;
    width: 100%;
    position: relative;
    overflow: hidden;
    padding: 20px;
    text-align: center;
}
h1{
    font-size: 100px;
}
#buut{
    position: absolute;
    width: 90vw;
    bottom: 15vh;
}
</style>